<!DOCTYPE html>
<html>
	<head>
	  	<meta charset="UTF-8">
		<script src="../../public/js/tmpl.js"></script>
		<script>
			var content = template('Phead_resource', {
				title: '我的优惠券'
			});
			document.write(content);
		</script>
	</head>
	<body class="wrap_bg coupon">
		
		<section class="main_count color-white">
		    
		    <ul class="coupon_list">
		    	
		    </ul>
		   
		</section>
		
		<!--<script>
			var content = template('progress_status', {});
			document.write(content);
		</script>
		-->
		<script id="coupon_list" type="html/javascript">
		{{each coupon_list}}
			<li class="card_box">
				
		    		<div class="am-radius card_left_box black_bg">
		    			<div class="am-cf">
		    				<h1 class="am-fl date_long">{{$value.long_time}}小时</h1>
		    				<div class="am-fl">
		    					<h3>{{$value.coupon_type}}</h3>
		    					<span class="grey_color">{{$value.use_area}}</span>
		    				</div>
		    			</div>
		    			<p class="grey_color">{{$value.describe}}</p>
		    			<p class="grey_color">有效期：{{$value.termValidity}}</p>
		    		</div> 
		    		
		    		{{if $value.isOverdue}}
		    		<div class="am-radius active_bg card_right_box">
		    			<span>未使用</span>
		    		</div>
		    		{{else}}
		    		<div class="am-radius grey_bg card_right_box">
		    			<span>已使用</span>
		    		</div>
		    		{{/if}}
		    	</li>
		    {{/each}}
		</script>
		
			
		
		<script>
			var content = template('Pfoot_resource', {});
			document.write(content);
		</script>
		<script type="text/javascript">
		
			(function($,arttmpl){
				
				var coupon_list = [
					{
						long_time:'1',
						coupon_type:'场地健身抵用券',
						use_area:'所有地区通用',
						describe:'暂时不支持抵用预约教练和活动费用',
						termValidity:'2017.08.08-2017.09.09',
						isOverdue:false
					},
					{
						long_time:'1',
						coupon_type:'场地健身抵用券',
						use_area:'所有地区通用',
						describe:'暂时不支持抵用预约教练和活动费用',
						termValidity:'2017.08.08-2017.09.09',
						isOverdue:true
					}
				];
				
				var drawCoupons = function(data){
					var d = {
						coupon_list:data
					};
					
					var content = arttmpl('coupon_list', d);
					$('.coupon_list').html(content);
				}
				
				
				var sucessCallback_Coupons = function(res){
					drawCoupons(res);
				}
				
				var errorcallback = function(statuscode, statusmsg) {
					console.log(statuscode + "  " + statusmsg);
				};
					
				var faildcallback = function(xhr, errtype, errthow) {
					console.log(xhr.readyState + "  " + xhr.status + "  " + xhr.statusText);
				};
				
				var getCoupons_data = function(op, sucessCallback, errorcallback, faildcallback){
					request('url', 't', 'd', coupon_list, sucessCallback, errorcallback, faildcallback);
				}
				
				
				
				
				var init = function(){
					
					getCoupons_data('op', sucessCallback_Coupons, errorcallback, faildcallback);
					var $modal = $('#my-modal-loading');
					$modal.hide();
				}
				
				init();
				
			})(jQuery, template)
			
		</script>
	</body>
</html>
